<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/reset.css">
</head>

<body>
    <div class="top">
        <div class="container">
            <div class="exise">
                <ul>
                    <li class="first">运动,就这么简单!</li>
                    <li class="last">
                        <i class="iconfont icon-shouji"></i>手机客户端下载
                    </li>
                </ul>
            </div>
            <div class="my">
                <ul>
                    <li>我的订单</li>
                    <li>用户中心</li>
                    <li>关于我们</li>
                    <li class="last">加入我们</li>
                </ul>
            </div>
            <ul>
                <li></li>
                <li></li>
            </ul>
        </div>

    </div>
    <div class="logo_search">
        <div class="container">
            <div class="content1">
                <ul class="logo">
                    <li>
                        <img src="./images/images/logo.png" alt="">
                    </li>
                    <label for="city">

                        <select name="" id="" style="border: 0;">
                            <option value="长沙">长沙</option>
                            <option value="永州" selected>广州</option>
                            <option value="怀化">怀化</option>
                        </select>
                    </label>
                </ul>

            </div>
            <div class="content2">
                <div class="border1">
                    <label for="city" style="border: transparent;">

                        <select name="" id="" style="border: 0;">
                            <option value="长沙">排球</option>
                            <option value="永州" selected>羽毛球</option>
                            <option value="怀化">篮球</option>
                        </select>
                    </label>
                </div>
                <div class="border2">
                    请输入场馆名称
                </div>
                <div class="border3">
                    搜索
                </div>
            </div>


        </div>
    </div>
    <div class="nav">
        <div class="container">
            <div class="nav_left">
                <ul class="left">
                    <li class="active">场馆预订</li>
                    <li>手机客户端</li>
                    <li class="pre">预订流程
                        <i class="iconfont icon-new"></i>
                    </li>
                </ul>
                <div class="nav_right">
                    <img src="./images/images/people.png" alt="">
                    你好!请&nbsp;[登录]&nbsp;&nbsp;[注册]
                    <div class="radius">

                    </div>
                </div>
            </div>


        </div>

    </div>
    <div class="banner">
        <div class="container">
            <div class="banner_left">
                <ul>
                    <li><a href=""><img src="./images/move.jpeg" alt=""></a></li>
                </ul>
                <div class="point">
                    <ol>
                        <li>1</li>
                        <li>2</li>
                        <li>3</li>
                        <li class="active">4</li>
                    </ol>
                </div>
                <div class="arrow">
                    <div class="left">&lt;</div>
                    <div class="right">&gt;</div>
                </div>
            </div>
            <div class="banner_right">
                <div class="tops">
                    <ul>
                        <li class="pad">客户端</li>
                        <li class="s1">微信</li>
                        <li class="s2">微博</li>
                    </ul>
                </div>
                <div class="bottoms">
                    <ul>
                        <li><img src="./images/images/erweima.png" alt=""></li>
                    </ul>
                    <div class="download">
                        <h1 style="color: #343434;font-size: 18px;">趣运动客户端</h1>
                        <p style="color: #888888;font-size: 12px; ">可扫描二维码下载</p>
                        <div class="img">
                            <div class="apple">
                                <img src="./images/images/apple.png" alt="">
                                苹果
                            </div>
                            <div class="andior">
                                <img src="./images/images/anDior.png" alt="">
                                安卓
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="main">
        <div class="container">
            <div class="main_left">
                <div class="main_nav">
                    <ul class="static">
                        <li>
                            <img src="./images/images/mouse.png" alt="">
                            <div class="content">
                                <h1 class="m1">第一步/<span class="m2">选场</span></h1>
                                <p class="m3">选择预定的时间和场次</p>
                            </div>

                            <img class="ctvs" src="./images/images/jiantou.png" alt="">
                        </li>
                        <li><img src="./images/images/money.png" alt="">
                            <div class="content">
                                <h1 class="m1">第二步/<span class="m2">支付</span></h1>
                                <p class="m3">支持支付宝及网银支付</p>
                            </div>

                            <img class="ctvs" src="./images/images/jiantou.png" alt="">
                        </li>
                        <li><img src="./images/images/phone.png" alt="">
                            <div class="content">
                                <h1 class="m1">第三步/<span class="m2">验证</span></h1>
                                <p class="m3">在球馆前台验证后打球</p>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="mains">
                    <div class="tomian">
                        <div class="product">
                            <li style="font-size: 16px;"><img src="./images/images/product.png" alt="">项目</li>
                            <div class="ss">
                                <li class="ball"><a href="" style="text-decoration: none; color: white;">羽毛球场</a></li>
                            </div>
                            <ul class="play">

                                <li>游泳馆</li>
                                <li>足球场</li>
                                <li>网球场</li>
                                <li>篮球场</li>
                                <li>壁球</li>
                            </ul>

                        </div>
                        <div class="ips">
                            <li style="font-size: 16px;" class="style"><img src="./images/images/ip.png" alt=""><a
                                    href="">区域</a></li>
                            <ul class="lets">
                                <li>不限</li>
                                <li>天河区</li>
                                <li>白云区</li>
                                <li>海珠区</li>
                                <li>荔湾区</li>
                                <li>越秀区</li>
                                <li>黄埔区</li>
                                <li>番禺区</li>
                                <li>花都区</li>
                                <li>增城市</li>
                                <li>从化市</li>
                                <li>萝岗区</li>
                                <li>南沙区</li>
                            </ul>
                        </div>
                        <div class="gyms">
                            <div class="gym1">
                                <img src="./images/images/gym.png" alt="">
                                <div class="content1">
                                    <h2 class="f1">广州体育馆</h2>
                                    <p class="f2">地址:白云区白云大道南783号广州新体育馆</p>
                                    <div>
                                        <span class="f3">层高:15m以上</span>
                                        <span class="f4">地板:木地板</span>
                                    </div>

                                </div>
                                <div class="content2">
                                    <h1 class="x1">优惠价:<span class="x2">25</span>元</h1>
                                    <p class="x3"><del>原价:35:00元</del></p>
                                    <div class="bangd">立即绑定</div>
                                </div>
                            </div>

                            <div class="gym2">
                                <img src="./images/images/gym.png" alt="">
                                <div class="content1">
                                    <h2 class="f1">广州体育馆</h2>
                                    <p class="f2">地址:白云区白云大道南783号广州新体育馆</p>
                                    <div>
                                        <span class="f3">层高:15m以上</span>
                                        <span class="f4">地板:木地板</span>
                                    </div>

                                </div>
                                <div class="content2">
                                    <h1 class="x1">优惠价:<span class="x2">25</span>元</h1>
                                    <p class="x3"><del>原价:35:00元</del></p>
                                    <div class="bangd">立即绑定</div>
                                </div>
                            </div>

                            <div class="gym3">
                                <img src="./images/images/gym.png" alt="">
                                <div class="content1">
                                    <h2 class="f1">广州体育馆</h2>
                                    <p class="f2">地址:白云区白云大道南783号广州新体育馆</p>
                                    <div>
                                        <span class="f3">层高:15m以上</span>
                                        <span class="f4">地板:木地板</span>
                                    </div>

                                </div>
                                <div class="content2">
                                    <h1 class="x1">优惠价:<span class="x2">25</span>元</h1>
                                    <p class="x3"><del>原价:35:00元</del></p>
                                    <div class="bangd">立即绑定</div>
                                </div>
                            </div>

                            <div class="gym4">
                                <img src="./images/images/gym.png" alt="">
                                <div class="content1">
                                    <h2 class="f1">广州体育馆</h2>
                                    <p class="f2">地址:白云区白云大道南783号广州新体育馆</p>
                                    <div>
                                        <span class="f3">层高:15m以上</span>
                                        <span class="f4">地板:木地板</span>
                                    </div>

                                </div>
                                <div class="content2">
                                    <h1 class="x1">优惠价:<span class="x2">25</span>元</h1>
                                    <p class="x3"><del>原价:35:00元</del></p>
                                    <div class="bangd">立即绑定</div>
                                </div>
                            </div>

                            <div class="gym5">
                                <img src="./images/images/gym.png" alt="">
                                <div class="content1">
                                    <h2 class="f1">广州体育馆</h2>
                                    <p class="f2">地址:白云区白云大道南783号广州新体育馆</p>
                                    <div>
                                        <span class="f3">层高:15m以上</span>
                                        <span class="f4">地板:木地板</span>
                                    </div>

                                </div>
                                <div class="content2">
                                    <h1 class="x1">优惠价:<span class="x2">25</span>元</h1>
                                    <p class="x3"><del>原价:35:00元</del></p>
                                    <div class="bangd">立即绑定</div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>

            </div>
            <div class="main_right">

                <div class="top">
                    推荐场馆
                </div>
                <div class="mains">
                    <div class="middle">
                        <img src="./images/images/gym.png" alt="">
                        <div class="write">
                            <p style="font-size: 12px;color: red;font-weight: 900;">趣运动·名狮羽毛球馆</p>
                            <p style="font-size: 12px;">价格&nbsp;:&nbsp;¥30.00</p>
                        </div>
                    </div>
                    <div class="bottom">

                        <ul class="bottom1">
                            <li>趣运动·新翼羽毛球馆</li>
                            <li>天河区科新羽毛球馆</li>
                            <li>荔湾区君雄羽毛球馆</li>
                            <li>海珠区广州创傲(纺织)体育运动场</li>
                            <li>白云区乐乐羽毛球馆</li>
                        </ul>
                        <ul class="bottom2">
                            <li>天河区</li>
                            <li>天河区</li>
                            <li>荔湾区</li>
                            <li>海珠区</li>
                            <li>白云区</li>
                        </ul>
                    </div>
                    <div class="foots">
                        <img src="./images/images/compete.png" alt="">
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div class="click">
        <div class="container">
            <div class="point">
                <ol>
                    <li class="cc actives">&lt;&lt;上一页</li>
                    <li class="active">1</li>
                    <li>2</li>
                    <li>3</li>
                    <li>4</li>
                    <li>5</li>
                    <li class="cc">下一页&gt;&gt;</li>
                </ol>
            </div>

        </div>

    </div>
    <div class="about">
        <div class="container">
            <div class="us">
                <ul class="us1">
                    <li>关于我们</li>
                    <li>加入我们</li>
                    <li>联系我们</li>
                </ul>
                <ul class="us2">
                    <li>帮助中心</li>
                    <li>预订流程</li>

                </ul>
                <ul class="us2">
                    <li>商家后台</li>
                </ul>
            </div>


            <div class="bottoms">
                <ul>
                    <li><img src="./images/images/erweima.png" alt=""></li>
                </ul>
                <div class="download">
                    <h1 style="color: #343434;font-size: 18px;">趣运动客户端</h1>
                    <p style="color: #888888;font-size: 12px; ">可扫描二维码下载</p>
                    <div class="img">
                        <div class="apple">
                            <img src="./images/images/apple.png" alt="">

                        </div>
                        <div class="andior">
                            <img src="./images/images/anDior.png" alt="">

                        </div>
                    </div>
                </div>
            </div>
            <ul class="tell">
                <li><i class="iconfont icon-zuoji"></i>4000-410-480</li>
                <li><i class="iconfont icon-shizhongfill"></i>10:00-21:00</li>
                <li style="padding-left:32px ;">周一至周六</li>
            </ul>
        </div>

    </div>
</body>

</html>